<html>	
  <head>
	  <title> A ProgressBar </title>
  	  <script type='text/javascript' src="http://www.google.com/jsapi"></script> 
      <script type='text/javascript' src="http://graphfm-progressbar.googlecode.com/svn/trunk/war/progressbar/progressbar.nocache.js"></script>

    <script type='text/javascript'>
      var num_modules = 1;


      // This function will be called after each module was loaded.
      function onLoadCallback() {
    	  // Render the visualization if this was the last module.
        if (--num_modules == 0) { 
        	drawVisualization();   
        }
      }
        

        
	 function drawVisualization() {
	 
		var data = new google.visualization.DataTable();
  		data.addRows(1);
  		data.addColumn('number', 'Popularity');

  		data.setValue(0, 0, .3);
   		options = {backgroundColor:"white",  foregroundColor:"blue", width:200, height:20};
   		           
   		var progressBar = new ProgressBar(document.getElementById('progressbar_div'));
  		progressBar.draw(data, options);
	}
	
      google.load("visualization", "1");
      google.setOnLoadCallback(onLoadCallback);
          
    </script>
  </head>

  <body>
    <h3>ProgressBar Sample</h3>
    <div class="graphfm" id="progressbar_div"></div>
  </body>

</html>
